<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity4">

<script type="text/javascript">
	if(window.parent!=window){
		window.parent.open("/user/to_login","_self");
		window.open("","_self").close();
	}
</script>

<!--[if IE 8]> <html lang="en" class="ie8 no-js"> <![endif]-->
<!--[if IE 9]> <html lang="en" class="ie9 no-js"> <![endif]-->
<!--[if !IE]><!-->
<html lang="en">
<!--<![endif]-->
    <!-- BEGIN HEAD -->
    <head>
		<meta charset="utf-8"/>
		<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
		<meta content="width=device-width, initial-scale=1" name="viewport" />
		<meta content="" name="author" />
		<link rel="shortcut icon" href="/static/favicon.ico" />
		<title>登录</title>
		<link href = "/static/pages/css/login.css" rel="stylesheet" style="text/css"/>
		<link href="/static/pages/css/login-4.min.css" rel="stylesheet" type="text/css" />
		<style type="text/css">
			[class*=" fa-"]:not(.fa-stack), [class*=" glyphicon-"], [class*=" icon-"], [class^=fa-]:not(.fa-stack), [class^=glyphicon-], [class^=icon-] {
			    display: inline-block;
			    line-height: 12px;
			    -webkit-font-smoothing: antialiased;
			}
			.login-form label.error{
				display:none !important;
			}
			@media (max-width: 480px){
				.login .content {
				    padding: 25px 12px;
				    width: 100% !important;
				}
			}
		</style>
	</head>
	
	<!--[if lt IE 9]>
	<script src="/static/global/plugins/respond.min.js"></script>
	<script src="/static/global/plugins/excanvas.min.js"></script> 
	<script src="/static/global/plugins/ie8.fix.min.js"></script> 
	<![endif]-->
	<script src="/static/global/plugins/require/require.js"></script>
	<script src="/static/require.config.js"></script>
	
    <!-- END HEAD -->
    <body class="login" style="margin:0px;">
        <!-- BEGIN LOGO -->
        <div class="logo" style="/* width: 100px; */margin-top:50px;">
            <a href="index.html">
                <img src="https://www.easyicon.net/api/resizeApi.php?id=508713&size=72" alt="" width="80px" height="auto">
                <img src="https://www.easyicon.net/api/resizeApi.php?id=508719&size=72" alt="" width="80px" height="auto">
                <img src="https://www.easyicon.net/api/resizeApi.php?id=508717&size=72" alt="" width="80px" height="auto">
            </a>
        </div>
        <!-- END LOGO -->
        <!-- BEGIN LOGIN -->
        <div class="content">
            <!-- BEGIN LOGIN FORM -->
            <form class="login-form" action="/authentication/form" method="post" novalidate="novalidate">
            	<input type="hidden"/>
                <h3 class="form-title" style="color:white;">pay-boy运营商系统 - 登录<br></h3>
                <div class="alert alert-danger display-hide" id="login_form_error_tip">
                    <span> Enter any username and password. </span>
                </div>
                <div class="form-group">
                    <div class="input-icon">
                        <i class="fa fa-user"></i>
                        <input class="form-control placeholder-no-fix" type="text" autocomplete="off" placeholder="手机号/邮箱" name="username"> </div>
                </div>
                <div class="form-group">
                    <div class="input-icon">
                        <i class="fa fa-lock"></i>
                        <input class="form-control placeholder-no-fix" type="password" autocomplete="off" placeholder="密码" name="password" /> </div>
                </div>
                <div class="form-group">
                    <div class="input-icon pull-left" style="width:62%;">
                        <i class="fa fa-envelope"></i>
                        <input class="form-control placeholder-no-fix" type="text" autocomplete="off" placeholder="验证码" name="imageCode" /> 
                    </div>
                    <div class="input-icon pull-right" style="width:35%;">
                    	<a>
							<img id="captcha" alt="验证码" src="/code/image?width=60" class="pull-right" style="width:94.5px;height:33px;" data-src="/code/image?width=60">
						</a>
                    </div>
                </div>
                <div class="form-actions" style="padding-top:25px;">
                    <label class="rememberme mt-checkbox mt-checkbox-outline">
                        <input id="remember-me" type="checkbox" value="true"/> 7天内自动登录
                        <span></span>
                    </label>
                    <button id="login_form_submit" type="button" data-loading-text="提交中..." class="btn green pull-right"> 登录 </button>
                </div>
            </form>
            <!-- END REGISTRATION FORM -->
    </body>
	<script type="text/javascript">
		// 创建app.js 调用helper
		require([
			'./static/pages/scripts/login'
		], function(login){
			require([
				'jquery',
				'jquery-lazyload',
				'backstretch'
			],function($){
				$(".backstretch img").lazyload({effect: "fadeIn"});
				// 轮播背景
			    $.backstretch([
			        "/static/pages/media/bg/4.jpg",
			    	"/static/pages/media/bg/2.jpg",
			        "/static/pages/media/bg/1.jpg",
			        "/static/pages/media/bg/3.jpg",
			        ], {
			          fade: 1000,
			          duration: 8000
			    	}
	        	);
			});
			login.init();
		});	
	</script>
</html>